<template>
	<view>
		<u-modal :show="noticeShow" :title="noticetitle" :content='noticeContent' @confirm="noticeShow=false"></u-modal>
		<dragBall @sonCilck="hint"></dragBall>
		<view class="head"></view>
		<u-tabs @click="click" :list="list " lineWidth="30" lineColor="#f8e913" :activeStyle="{
		            color: '#ffffff',
		            fontWeight: 'bold',
		            transform: 'scale(1.05)'
		        }" :inactiveStyle="{
		            color: '#ffffff',
		            transform: 'scale(1)'
		        }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;">
		</u-tabs>
		<view class="contentBox">
			<view style="margin: auto;">
				<view class="content" v-for="(item,index) in sonList" @click="goPage(item)">
					<view class="notice" v-if="$comm.checkNull(item.remark)">
						{{item.remark}}
					</view>
					<view><text :class="'icon iconfont '+getIcon(item.menuName)"></text></view>
					<view class="contentText">
						<view>
							<text class="title">{{item.menuName}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
	import dragBall from './comm/geek-cat-dragball/drag_ball.vue'
	export default {
		onLoad() {
			this.menuList = uni.getStorageSync("merchantMenu")
			//获得一级菜单
			this.list = this.menuList.filter(item => item.parentId == -1 && item.id != 108)
			this.list.forEach(item => {
				item.name = item.menuName
			})
			this.getSonList(this.list[0].id)
		},
		data() {
			return {
				noticeShow: false,
				noticeTitle: "",
				noticeContent: "如有疑问或不会使用，请移步至我的-在线客服处联系客服或者拨打客服电话：13432110777咨询",
				menuList: [],
				//一级菜单
				list: [],
				//二级菜单
				sonList: []
			}
		},
		components: {
			dragBall
		},
		methods: {
			hint() {
				console.log("父点击事件");
				this.noticeShow = true
			},
			click(item) {
				this.getSonList(item.id)
			},
			getSonList(parentId) {
				this.sonList = this.menuList.filter(item => item.parentId == parentId && item.flag == 1)

				console.log('sonList', this.sonList)
			},

			getIcon(name) {
				switch (name) {
					case "订单管理":
						return "icon-dingdan";
					case "商品管理":
						return "icon-tianjiashangpin";
					case "区域管理":
						return "icon-quyuguanli";
					case "果蔬管理":
						return "icon-guoshu";
					case "评价管理":
						return "icon-daipingjia";
					case "合伙人管理":
						return "icon-hehuorenzhaomu";
					case "提现管理":
						return "icon-tixianjilu";
					case "银行卡管理":
						return "icon-yinhangqia";
					case "已租出的区域":
						return "icon-zichanzulinchujieshenqing-266";
					case "套餐管理":
						return "icon-zixuantaocan";
					case "运费列表":
						return "icon-yunfeiguanli";
					case "报名人员列表":
						return "icon-haoyou";
					case "活动列表":
						return "icon-wenhuahuodong";
					case "团购商品":
						return "icon-tuangoulaiyuan";
					case '摘种订单':
						return 'icon-dingdan'
				}
			},
			goPage(item) {
				let url;
				switch (item.menuName) {
					case "订单管理":
						url = "groupManage/orderList"
						break;
					case "商品管理":
						url = ""
						break;
					case "区域管理":
						url = "areaManage/regionList"
						break;
					case "果蔬管理":
						url = "landManage/goods/list"
						break;
					case "评价管理":
						url = "evaluateManage/evaluateList"
						break;
					case "合伙人管理":
						url = "partnerManage/detail"
						break;
					case "提现管理":
						url = "financialManage/withdrawalDetails/list"
						break;
					case "银行卡管理":
						url = "financialManage/bankCard/list"
						break;
					case "已租出的区域":
						url = "rentManage/leaseList"
						break;
					case "套餐管理":
						url = "rentManage/setMeal"
						break;
					case "运费列表":
						url = "freightManage/list"
						break;
					case "报名人员列表":
						url = "activityManage/people/list"
						break;
					case "活动列表":
						url = "activityManage/activity/list"
						break;
					case "团购商品":
						url = "groupManage/goods/list"
						break;
					case "摘种订单":
						url = "landManage/order/list"
						break;
				}
				if (item.parentId == 108) {
					//普通商品订单管理
					url = ""
				}
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff;
	}

	.head {
		background-color: #3994ff;
		height: 30rpx;
	}

	view.data-v-48634e29,
	scroll-view.data-v-48634e29,
	swiper-item.data-v-48634e29 {
		height: 6vh;
		background-color: #3994ff;
		display: flex;
		flex-direction: column;
		flex-shrink: 0;
		flex-grow: 0;
		flex-basis: auto;
		align-items: stretch;
		align-content: flex-start;
	}

	.contentBox {
		display: flex;
		height: 70vh;

		.content {
			position: relative;
			margin: 20rpx 0rpx;
			width: 720rpx;
			height: 630rpx;
			background-color: #bbd5ff63;
			border-radius: 45rpx;
			display: flex;

			.notice {
				position: absolute;
				width: 400rpx;
				left: 40rpx;
				top: 40rpx;
				color: #3060a9;
				font-weight: 600;
				font-size: 28rpx;
			}

			.contentText {
				margin: auto;



				.title {
					font-size: 100rpx;
					color: #3060a9;
					font-weight: 900;
				}
			}

			.icon {
				position: absolute;
				top: 28rpx;
				right: 35rpx;
				font-size: 220rpx;
				color: #397cc147;
			}
		}
	}
</style>
